<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>模板字符串详细使用</title>
</head>
<body>
  
  <script>
    // 0. es5中字符串拼接
    // var name = '张三'
    // var age = 18
    // var str = '我叫' + name + ',今年' + age + '岁'
    // console.log(str)
    
    // es6中模板字符串
    // 1. 定义字符串
    let str = `hello world`
    console.log(str, typeof str)

    // 2. 多行字符串
    let str1 = `hello 
    world`
    console.log(str1)

    // 3. 字符串拼接
    let name = '张三'
    let age = 18
    let str2 = `我叫${name},今年${age}岁`
    console.log(str2)

    // 4. 标签模板字符串的用法
    function foo(...args) {
      console.log("参数:", args)
    }

    // foo("why", 18, 1.88)
    foo`my name is ${name}, age is ${age}, height is ${1.88}`
    
  </script>
  
</body>
</html>